<%@ page contentType="text/html;charset=utf-8" language="java"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@include file="./common/base.jsp" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>用户中心_约导游</title>
<!--css-->
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="css/wutongstyle.css">
<link rel="stylesheet" type="text/css" href="city/citySelector.css">

<script src="city/citySelector.js" type="text/javascript"></script>
<script type="text/javascript" src="js/plupload.full.min.js"></script>
<script type="text/javascript" src="js/qiniu.js"></script>
</head>

<body>
<!--head begin-->
<%@ include  file="./common/header.jsp"%>
<!--nav end--> 
<!--content begin-->
<div class="wt_content">
  <dl class="yuedaoyou">
	<%@ include  file="./common/header1.jsp"%><dd>
    <dd>
      <div class="daoyou_info clearfix">
        <div class="xx_box">
          <div class="tainfobox yonghu">
            <h3 id="tuan"><i class="i_co"></i>我的资料</h3>
            <form id="guideUserId">
            <table width="100%" border="0" cellspacing="0" cellpadding="0" class="biaodan">
            <tr>
                <td><input type="hidden" value="" id="pkId"></td>
              </tr>
             <tr>
                <td class="title">真实姓名：</td>
                <td><input type="text" name="name" value="" id="nameId"></td>
              </tr>
                 <tr>
                <td class="title">身份证号：</td>
                <td><input type="text" value="" name="idnum" id="idnumId"></td>
              </tr>
              <tr>
                <td class="title">导游证号：</td>
                <td><input type="text" value=""  id="guidenumId"></td>
              </tr>
              <tr>
                <td class="title">性别：</td>
                <td><input name="gender" type="radio" value="1" class="sex" checked/> 男&nbsp;&nbsp;&nbsp;&nbsp;<input name="gender" type="radio" value="0"  class="sex"/> 女</td>
              </tr>
              <tr>
                <td class="title">所在城市：</td>
                <td><input type="text" id="szCityId" value="" name="szCity" class="cityinput" placeholder=""></td>
              </tr>
              <tr>
                <td class="title">擅长讲解城市：</td>
                <td><input type="text" id="scjjCityId" value="" class="cityinput" placeholder=""></td>
              </tr>
              <tr>
                <td class="title">语种：</td>
                <td><input type="text" value="" id="languageId"></td>
              </tr>
              <tr>
                <td class="title">是否出境带队：</td>
                <td><input name="isoutbound" type="radio" value="1" class="sex" /> 是&nbsp;&nbsp;&nbsp;&nbsp;<input name="isoutbound" type="radio" value="0"  class="sex" checked/> 否</td>
              </tr>
              <tr>
                <td class="title">联系电话：</td>
                <td><input type="text" value="" name="phone" id="phoneId"></td>
              </tr>
              <tr>
                <td class="title">期望导服：</td>
                <td><input type="text" name="guidecost" value="" id="guidecostId">&nbsp;元/天</td>
              </tr>
              <tr>
                <td class="title">工作年限：</td>
                <td><input type="text" name="workyear" value="" id="workyearId"></td>
              </tr>
              <tr>
                <td class="title">电子信箱：</td>
                <td><input type="text" value="" name="email" id="emailId"></td>
              </tr>
              <tr >
                <td class="title">个人头像：</td>
                <td>
                <div class="col-md-12">
		            <div id="up_bg_img_parentId">
		                <a class="btn btn-default " id="up_bg_img" style="margin-left:-15px;" href="#" >
		                    <i class="glyphicon glyphicon-plus"></i>
		                    <sapn>选择文件</sapn>
		                </a>
		            </div>
		        </div>
                <!--  <div id = "up_bg_img_parentId"><input name="" type="button" value="选择图片上传" onClick="up_bg_img.click()" class="upload"/>
                	<input type="file" name="up_bg_img"  class="uploading" id="up_bg_img" style="display:none;"/></div>-->
                	<input type="hidden" id="backgroundValId"></input>
                	<div class="process-bar skin-blue" style="display:none;" id="processbarId">
				     <div class="pb-wrapper">
				     <div class="pb-highlight"></div>
				     <div class="pb-container">
				     <div class="pb-text" id="processbarVal1Id">0%</div>
				     <div class="pb-value" id="processbarVal2Id" style="width:0%"></div>
				     </div>
				     </div>
				     </div>
                </td>
              </tr>
             <!--   <tr>
                <td class="title">个人头像：</td>
                <td><img src="" id ="backgroundId" width="185" height="185"/>
                    <input type="hidden" id="backgroundValId"></input>
                </td>
              </tr>-->
              <tr>
                <td class="title">密码：</td>
                <td><input type="text" name="pass"  id="passId">
                  <font>如不需要修改，请留空</font></td>
              </tr>
              <tr>
                <td class="title">确认密码：</td>
                <td><input type="text" name="confirmpass"  id="confirmpassId">
                  <font>如不需要修改，请留空</font></td>
              </tr>
              <!--  <tr>
                <td class="title">个人签名：</td>
                <td><input type="text" value=""></td>
              </tr>-->
              <tr>
                <td class="title">自我介绍：</td>
                <td><textarea name="" style="word-wrap:break-word; word-break:break-all;" cols="" rows="" id="descriptionId"></textarea></td>
              </tr>
              <tr>
                <td>&nbsp;</td>
                <td><button type="button" value="确  认" onclick="modifyGuideDetail()">确  认</button></td>
              </tr>
            </table>
            </form>
          </div>
        </div>
        <div class="zp"><img src="" id="headImgId"  width="185" height="185" />
          <div class="tel">
            <h4>快捷菜单</h4>
            <ul class="quick">
              <li><a href="dylogin_5.jsp" >最新发团信息</a></li>
              <li><a href="dylogin_1.jsp">已申请的团</a></li>
              <li><a href="dylogin_6.jsp" >已确认的团</a></li>
              <li><a href="dylogin_2.jsp" >已带队的团</a></li>
              <li><a href="dylogin_7.jsp" >团信息列表</a></li>
              <li><a href="dylogin_3.jsp" class="on">我的资料</a></li>
              <li><a href="dylogin_4.jsp">站内短信列表</a></li>
            </ul>
          </div>
          
        </div>
      </div>
    </dd>
  </dl>
</div>
<!--content end
<div class="tipc" style="display:none;" id="showWanShanId"><a href="dylogin_3.jsp">请先完善注册资料</a>
<a href="javascript:closeShowWanShan()">关闭</a>
</div>--> 
<!--footer begin-->
<%@ include  file="./common/footer.jsp"%>
<!--footer end-->
</body>
<script type="text/javascript">

$(function(){
	new Vcity.CitySelector({input:'szCityId'});
	new Vcity.CitySelector({input:'scjjCityId'});
	loadGuideDetail();
	//showWanShanFuc();
});
/* function closeShowWanShan(){
	document.getElementById("showWanShanId").style.display="none";
}
function showWanShanFuc(){
	if(showWanShan==0){
		document.getElementById("showWanShanId").style.display="block";
		refreshWanShan();
	}else{
		document.getElementById("showWanShanId").style.display="none";
	}
} */
function guideUserValidate() {
	return $('#guideUserId').validate({  
        rules:{  
	        	name:'required', 
	        	idnum:'required', 
	        	phone:'required',
	        	szCity:'required',
	        	guidecost:'number',
	        	workyear:'digits',
	        	email:'email',
	        	pass:{
	        		minlength:6
	        	}
            },  
        messages:{  
        	name:'&nbsp;&nbsp;姓名不能为空',
        	idnum:'&nbsp;&nbsp;身份证不能为空',  
        	phone:'&nbsp;&nbsp;请填写手机号',
        	szCity:'&nbsp;&nbsp;请填写所在城市',
        	guidecost:'&nbsp;&nbsp;必须是数字哦',
        	workyear:'&nbsp;&nbsp;必须是整数哦',
        	email:'&nbsp;&nbsp;请输入正确邮箱格式,例:xxx@xxx.com',
        	pass: {
       	     	minlength:$.validator.format("密码不能小于{0}个字 符")
       	    }
            },  
    });  
}
function uploadHeadImg() {
	var id = $("#pkId").val();
	var photo = $("#backgroundValId").val().replace(imgDomain,"");
	objp= "{\"id\":\""+id+"\","+
    		"\"photo\":\""+photo+"\""+
    "}";
	$.ajax({
		  url: '${path}/core/modifyUserDetail',
		  type: 'POST',
		  timeout: 30000,
		  cache : false,
	      data :objp,
	      async: false,
	      dataType:"json",      
          contentType:"application/json",   
		  success:function(msg){
			  alert("头像设置完成");
		  },
		   failure:function(msg){
			   alert(eval('('+msg.responseText+')').error_text);
		   		
		   },
		   error:function(msg){
			   alert(eval('('+msg.responseText+')').error_text); 
		   }
	});
}

function modifyGuideDetail(){
	if(guideUserValidate().form()){
	}else{
		return;
	}
	var id = $("#pkId").val();
	var name = $("#nameId").val();
	var email = $("#emailId").val();
	var idnum = $("#idnumId").val();
	var city = $("#szCityId").val();
	var guidenum = $("#guidenumId").val();
	var phone = $("#phoneId").val();
	var city = $("#szCityId").val();
	var goodatcity = $("#scjjCityId").val();
	var workyear = $("#workyearId").val();
	var language  = $("#languageId").val();
	var description  = escape($("#descriptionId").val());
	var isoutbound = $("input[name='isoutbound']:checked").val(); 
	var gender = $("input[name='gender']:checked").val();
	var guidecost = $("#guidecostId").val();
	var pass = $("#passId").val();
	var confirmpass = $("#confirmpassId").val();
	if(pass!=null && pass!=""){
		if(confirmpass!=pass) {
			alert("两次密码不一致");return;
		}
	}
	
	//var photo = $("#backgroundValId").val().replace(imgDomain,"");
	objp= "{\"id\":\""+id+"\","+
		         "\"name\":\""+name+"\","+
		         "\"idnum\":\""+idnum+"\","+
		         "\"phone\":\""+phone+"\","+
		         "\"guidenum\":\""+guidenum+"\","+
		         "\"isoutbound\":\""+isoutbound+"\","+
		         "\"language\":\""+language+"\","+
		         "\"guidecost\":\""+guidecost+"\","+
		         "\"workyear\":\""+workyear+"\","+
		         "\"gender\":\""+gender+"\","+
		         "\"email\":\""+email+"\","+
		         //"\"photo\":\""+photo+"\","+
		         "\"description\":\""+description+"\","+
		         "\"city\":\""+city+"\","+
		         "\"password\":\""+confirmpass+"\","+
		         "\"goodatcity\":\""+goodatcity+"\""+
		         "}";
	$.ajax({
		  url: '${path}/core/modifyUserDetail',
		  type: 'POST',
		  timeout: 30000,
		  cache : false,
	      data :objp,
	      async: false,
	      dataType:"json",      
          contentType:"application/json",   
		  success:function(msg){
			  alert("ok");
		  },
		   failure:function(msg){
			   alert(eval('('+msg.responseText+')').error_text);
		   		
		   },
		   error:function(msg){
			   alert(eval('('+msg.responseText+')').error_text); 
		   }
	});
}

function loadGuideDetail(){
	var objp={};
	$.ajax({
		  url: '${path}/core/getAccountDetail',
		  type: 'POST',
		  timeout: 30000,
		  cache : false,
	      data :objp,
	      async: false,
	      dataType:"json",      
        contentType:"application/json",   
	     // contentType: "application/json; charset=utf-8",
		  success:function(msg){
			  formatGuideDetail(msg.userDetail);
		  },
		   failure:function(msg){
			   alert(eval('('+msg.responseText+')').error_text);
		   		
		   },
		   error:function(msg){
			   alert(eval('('+msg.responseText+')').error_text); 
		   }
	});
}
function formatGuideDetail(data){
	if(data){
		$("#pkId").val(data.id);
		$("#nameId").val(data.name);
		$("#idnumId").val(data.idnum);
		$("#guidenumId").val(data.guidenum);
		$("#szCityId").val(data.city);
		$("#scjjCityId").val(data.goodatcity);
		$("input[name='gender'][value="+data.gender+"]").attr("checked",true); 
		$("input[name='isoutbound'][value="+data.isoutbound+"]").attr("checked",true); 
		$("#phoneId").val(data.phone);
		$("#guidecostId").val(data.guidecost);
		$("#languageId").val(data.language);
		$("#workyearId").val(data.workyear);
		$("#descriptionId").val(data.description);
		//$("#workyearId").val(data.workyear);
		$("#emailId").val(data.email);
	    //$("#backgroundId").attr("src",imgDomain+data.photo);
        $("#backgroundValId").val(imgDomain+data.photo);
        //$("#backgroundId").css("width",185).css("height",185);
        $("#headImgId").attr("src",imgDomain+data.photo);
	}
}
//*********************start****************************
function getUpToken() {
	var objp={};
	var token = "";
	 $.ajax({
		  url: '${path}/core/getUpToken',
		  type: 'POST',
		  timeout: 30000,
		  cache : false,
	      data :objp,
	      async: false,
		  success:function(msg){
			  //setCardInfo(msg.cardInfo)
			  token =  msg.uptoken;
		   },
		   failure:function(msg){
			   alert(eval('('+msg.responseText+')').error_text);
		   		
		   },
		   error:function(msg){
			   alert(eval('('+msg.responseText+')').error_text); 
		   }
	});
	 return token;
}
$(function() {
var wei7 = generateMixed(7); 	
//var uptokenStr = getUpToken();
var uploader = Qiniu.uploader({
    runtimes: 'html5,flash,html4',    //上传模式,依次退化
    browse_button: 'up_bg_img',       //上传选择的点选按钮，**必需**
    uptoken_url: '${path}/core/getUpToken',            //Ajax请求upToken的Url，**强烈建议设置**（服务端提供）
    // downtoken_url: '/downtoken',
    // Ajax请求downToken的Url，私有空间时使用,JS-SDK将向该地址POST文件的key和domain,服务端返回的JSON必须包含`url`字段，`url`值为该文件的下载地址
    //uptoken : uptokenStr, //若未指定uptoken_url,则必须指定 uptoken ,uptoken由其他程序生成
    // unique_names: true, // 默认 false，key为文件名。若开启该选项，SDK会为每个文件自动生成key（文件名）
    // save_key: true,   // 默认 false。若在服务端生成uptoken的上传策略中指定了 `sava_key`，则开启，SDK在前端将不对key进行任何处理
    domain: 'http://guide.qiniudn.com/',   //bucket 域名，下载资源时用到，**必需**
    container: 'up_bg_img_parentId',//document.getElementById('up_bg_img_parentId'),          //上传区域DOM ID，默认是browser_button的父元素，
    max_file_size: '100mb',           //最大文件体积限制
    flash_swf_url: 'js/Moxie.swf',  //引入flash,相对路径
   // silverlight_xap_url:'js/Moxie.xap',
    max_retries: 2,                   //上传失败最大重试次数
    //dragdrop: true,                   //开启可拖曳上传
    //drop_element: 'up_bg_img_parentId',        //拖曳上传区域元素的ID，拖曳文件或文件夹后可触发上传
    chunk_size: '4mb',                //分块上传时，每片的体积
    auto_start: true,   
    unique_names: false ,
    save_key: false,//选择文件后自动上传，若关闭需要自己绑定事件触发上传,
    init: {
        'FilesAdded': function(up, files) {
            plupload.each(files, function(file) {
                // 文件添加进队列后,处理相关的事情
            	uploader.start();
            	return true;
            });
        },
        'BeforeUpload': function(up, file) {
               // 每个文件上传前,处理相关的事情
               $('#processbarId').css("display","inline-block");
        },
        'UploadProgress': function(up, file) {
               // 每个文件上传时,处理相关的事情
               
               $('#processbarVal1Id').html(file.percent + "%");
               $('#processbarVal2Id').css("width",file.percent + "%");
        },
        'FileUploaded': function(up, file, info) {
               // 每个文件上传成功后,处理相关的事情
               // 其中 info 是文件上传成功后，服务端返回的json，形式如
               // {
               //    "hash": "Fh8xVqod2MQ1mocfI4S4KpRL6D98",
               //    "key": "gogopher.jpg"
               //  }
               // 参考http://developer.qiniu.com/docs/v6/api/overview/up/response/simple-response.html

                //var domain = up.getOption('domain');
               /// var res = parseJSON(info);
               // var sourceLink = domain + res.key;// 获取上传成功后的文件的Url
              
              // $("#backgroundId").attr("src",imgDomain+loginUserId+"_"+wei7+file.name);
              // $("#backgroundId").css("width",185);
               $("#backgroundValId").val(loginUserId+"_"+wei7+file.name);
               $("#headImgId").attr("src",imgDomain+loginUserId+"_"+wei7+file.name);
               uploadHeadImg();
        },
        'Error': function(up, err, errTip) {
        	$('#processbarId').css("display","none");
        	alert(err.code+"--"+err.message);
               //上传出错时,处理相关的事情
        },
        'UploadComplete': function() {
               //队列文件处理完毕后,处理相关的事情
        	$('#processbarId').css("display","none");
               
        },
        'Key': function(up, file) {
            // 若想在前端对每个文件的key进行个性化处理，可以配置该函数
            // 该配置必须要在 unique_names: false , save_key: false 时才生效
            var key = loginUserId+"_"+wei7+file.name;
            // do something with key here
            return key
        }
    }
});
uploader.bind('Error', function(error){
    alert(error);
});
});
/************end*******************/
</script>
</html>
